<%layout("/common/_layout.html"){ %>
  <%#ajax userTable:{%>
  <div class="am-cf am-padding">
    <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">报表中心</strong> / <small>V网报表</small></div>
  </div>
  <div class="am-g">
    <div class="am-u-sm-12">
      <form class="am-form" id="list-form" action="${base}/vnetReport/list" method="post">
        <input type="hidden" id="keywords" name="keywords" value='${keywords!""}' />
        <input type="hidden" id="isExport" name="isExport" value='${isExport!"0"}' />
        <table class="am-table am-table-bordered am-table-radius table-main" style="padding:0;">
          <tbody>
            <tr>
              <th class="am-text-middle">店员所属机构</th>
              <td>
                 <div class="am-u-sm-10">
                        <select data-am-selected="{btnSize:'sm',maxHeight: 400,btnWidth:'100%'}" name="org_id" id="org_id">
                            <%for(orgNode in orgList){%>
                            <option value="${orgNode.value}" <%if(org_id==orgNode.value){%>
                                selected
                                <%}%>>${orgNode.key}</option>
                            <%}%></select>
                    </div>
              </td>
              <th class="am-text-middle">办理时间</th>
              <td>
                   <div class="am-u-sm-10">
                    <div class="am-form am-form-inline">
                          <div class="am-form-group am-form-icon">
                            <i class="am-icon-calendar"></i>
                            <input type="text" class="am-form-field am-input-sm" id="startTime" value="${startTime!}" placeholder="开始日期" data-am-datepicker>
                          </div>
                      <div class="am-form-group">至</div>
                          <div class="am-form-group am-form-icon">
                            <i class="am-icon-calendar"></i>
                            <input type="text" class="am-form-field am-input-sm" id="endTime" value="${endTime!}" placeholder="结束日期" data-am-datepicker>
                          </div>
                    </div>
                   </div>
              
                </td>
            </tr>
            <tr>
              <th class="am-text-middle">V网名称</th>
              <td>
                <div class="am-u-sm-10">
                  <input type="text" id="vgroupname" class="am-form-field am-input-sm" value="${vgroupname!}" />
                </div>
              </td>
              <th class="am-text-middle">V网编码</th>
              <td>
              <div class="am-u-sm-10">
                  <input type="text" id="vgroupcode" class="am-form-field am-input-sm" value="${vgroupcode!}" />
                </div>
            </td>
            </tr>
            
            <tr>
              <th class="am-text-middle">店员姓名</th>
              <td>
                <div class="am-u-sm-10">
                  <input type="text" id="username" class="am-form-field am-input-sm" value="${username!}" />
                </div>
              </td>
              <th class="am-text-middle">店员手机</th>
              <td>
                <div class="am-u-sm-10">
                  <input type="text" id="usermobile" class="am-form-field am-input-sm" value="${usermobile!}" />
                </div>
              </td>
            </tr>
            <tr>
              <th class="am-text-middle">成员手机</th>
              <td>
                <div class="am-u-sm-10">
                  <input type="text" id="member" class="am-form-field am-input-sm" value="${member!}" />
                </div>
              </td>
              <th class="am-text-middle">客户经理</th>
              <td>
              <div class="am-u-sm-10">
                  <label class="am-radio-inline">
                    <input type="radio" id="beMgr" name="isMgr" value="1" data-am-ucheck <%if(isMgr! == "1"){%>
                                checked
                                <%}%> > 是
                  </label>
                  <label class="am-radio-inline">
                    <input type="radio" id="notMgr" name="isMgr" value="0" data-am-ucheck <%if(isMgr! == "0"){%>
                                checked
                                <%}%>> 否
                  </label>
                  <label class="am-radio-inline">
                    <input type="radio" id="whatever" name="isMgr" value="2" data-am-ucheck <%if(!has(isMgr)||(isMgr! == "2")){%>
                                checked
                                <%}%>> 全部
                  </label>
                </div>
            </td>
            </tr>
            <tr>
              <th class="am-text-middle">V网类型</th>
              <td>
                <div class="am-u-sm-10">
                  <select data-am-selected="{btnSize:'sm',btnWidth: '100%'}" id="vgrouptype" name="vgrouptype" >
                    <option value="-1"
                      <%if("-1"==vgrouptype!"0"){%>
                      selected
                      <%}%>>所有</option>
                    <option value="0"
                      <%if("0"==vgrouptype!"0"){%>
                      selected
                      <%}%>>校园V网</option>
                    <option value="1"
                      <%if("1"==vgrouptype!"0"){%>
                      selected
                      <%}%>>合家欢</option>
                    <option value="2"
                      <%if("2"==vgrouptype!"0"){%>
                      selected
                      <%}%>>乡音网</option>
                  </select>
                  </div>
              </td>
              <!-- <th class="am-text-middle">店员手机</th>
              <td>
                <div class="am-u-sm-10">
                  <input type="text" id="usermobile" class="am-form-field am-input-sm" value="${usermobile!}" />
                </div>
              </td> -->
            </tr>

            <tr>
                <td colspan="4">
                  <div align="left" style="color: #FF3F3F;">
                    <span style="font-family: '黑体';">*</span> 默认显示校园V网报表，可查询所有类型V网业务报表（暂无合家欢数据）
                  </div>
                  <div align='right'>
                    <button type="button" class="am-btn am-btn-default am-btn-sm am-text-secondary" id="submit-btn">搜索</button>
                    <%if(so.hasPermission("VNET_REPORT_EXPORT")) {%>
                    <button type="button" class="am-btn am-btn-default am-btn-sm am-text-secondary" id="export-btn">导出</button>
                    <%}%>
                  </div>
                </td>
            </tr>
            
            <tr id="download" style="display:none">
                <td colspan="4">
                  <div align='center'>
                    <a id="downloadlink" href="#">导出成功，点击下载</a>
                  </div>
                </td>
            </tr>
          </tbody>
        </table>
      </form>
    </div>
    <div class="am-u-sm-12 am-u-md-12" style="padding:0 1.6rem 1.6rem 1rem;margin:0;">
      <div class="am-btn-toolbar" style="padding-left:.5rem;">
      </div>
    </div>
  </div>
  <div class="am-g">
    <div class="am-u-sm-12">
    <div class="am-scrollable-horizontal">
      <table class="am-table am-table-striped am-table-hover table-main">
        <thead>
          <tr class="am-text-nowrap">
            <th class="table-title">V网类型</th>
            <th class="table-title">V网名称</th>
            <th class="table-title">V网编码</th>
            <th class="table-title">业务类型</th>
            <th class="table-title">V网成员</th>
            <th class="table-title">成员短号</th>
            <th class="table-title">资费名</th>
            <th class="table-title">费率</th>
            <th class="table-title">店员姓名</th>
            <th class="table-title">店员手机</th>
            <th class="table-title">地市</th>
            <th class="table-title">区县</th>
            <th class="table-title">渠道编码</th>
            <th class="table-title">渠道名称</th>
            <th class="table-title">渠道类型</th>
            <th class="table-title">客户经理</th>
            <th class="table-title">办理时间</th>
            <th class="table-title">备注</th>

          </tr>
        </thead>
        <tbody>
          <%for(list in pager.list!){%>
            <tr>
              <td>${list.vType}</td>
              <td>${list.v_name}</td>
              <td>${list.v_code}</td>
              <td>${list.opType}</td>
              <td>${list.v_member}</td>
              <td>${list.v_short}</td>
              <td>${list.v_pkg_name}</td>
              <td>${list.v_pkg_rate}</td>
              <td>${list.user_name}</td>
              <td>${list.user_mobile}</td>
              <td>${list.city}</td>
              <td>${list.quxian}</td>
              <td>${list.channel_code}</td>
              <td>${list.channel_name}</td>
              <td>${list.channel_type}</td>
              <td>${list.is_accounts_manager}</td>
              <td>${list.opTime}</td>
              <td>${list.remark}</td>
            </tr>
           <%}%> 
        </tbody>
     </table>
     </div>
      <div class="am-cf">
         <!-- 分页 -->
         <%if (pager.list.~size > 0){%>
             <div class="am-fr">
                 <% include("/admin/common_pager.tpl"){}%>
             </div>
         <%}else{%>
             <div class="am-kai">
               <h3>没有找到任何记录!</h3>
             </div>
         <%}%>
      </div>
    
    </div>
  </div>
  <script type="text/javascript">
    $(function(){
      var keywordsObj = {};
      
      function setKeyWords(){
    	  if($("#org_id").val())
          keywordsObj.org_id = $("#org_id").val();
        if($("#username").val())
          keywordsObj.username = $("#username").val();
          
        if($("#startTime").val())
          keywordsObj.startTime = $("#startTime").val();
        if($("#endTime").val())
          keywordsObj.endTime = $("#endTime").val();
          
        if($("#usermobile").val())
            keywordsObj.usermobile = $("#usermobile").val();
            
        if($("#member").val())
          keywordsObj.member = $("#member").val();
          
        if($("#vgroupname").val())
          keywordsObj.vgroupname = $("#vgroupname").val();
          
        if($("#vgroupcode").val())
          keywordsObj.vgroupcode = $("#vgroupcode").val();
              
        if ($("#vgrouptype").val()) {
          keywordsObj.vgrouptype = $("#vgrouptype").val();
        }  
            
        var $checkObj = $("input[name='isMgr']");
        
        for(var i=0;i<$checkObj.length;i++){
            if($checkObj[i].checked){
                keywordsObj.isMgr =$checkObj[i].value;
                break;
            }
        }

        var keywords = "";
        if(!$.isEmptyObject(keywordsObj)){
          keywords = JSON.stringify(keywordsObj);
        }
        console.log("keywords = "+ keywords);
        
        $("#keywords").val(keywords);
      }
      
      $("#submit-btn").on("click",function(){
    	setKeyWords();
    	$("#isExport").val("0");    
        $("#list-form").submit();
      });
      
      $("#export-btn").on("click",function(){
          $('#download').hide();
          //loading层
          var index = parent.layer.load(0, {
              shade: [0.1,'#fff'] //0.1透明度的白色背景
          });
          setKeyWords();
          $("#isExport").val("1");    
          //$("#list-form").submit();
          var formParam = $("#list-form").serialize();//序列化表格内容为字符串  
          $.ajax({  
            type:'post',      
            url:'${base}/vnetReport/list',  
            data:formParam,  
            success:function(data){              
               console.log(data);
               if(data.status==1){
                 $('#downloadlink').text(data.message);
                 $('#downloadlink').attr('href',data.url);
                 $('#download').show();
              }else{
                 $('#downloadlink').text(data.message);
                 $('#download').show();
              }
              parent.layer.close(index);
            },
            error: function() { 
               parent.layer.close(index);
            } 
          }); 
        });
    });
  </script>
  <%}%>
<%}%>